How to use the Next and Previous Buttons to Navigate the Controls in the Active Panel in an iOS Application

Description

The native iOS keyboard has a next and previous button that can be used to navigate input controls on the screen. These buttons can be used with Alpha Anywhere application to navigate controls in the active Panel, however a little work is required to make sure the next or previous buttons do not try to navigate to a control that is on a panel that is not visible.

Discussion

When you run a UX component on a native iOS device, the native iOS keyboard has next/prev buttons to navigate to the next and previous input control on the screen. If you have a UX component with multiple panels and focus is on the last input control on the currently visible Panel, if you tap the next button, focus will go to the next input control, which may be a Panel Card that is not currently visible. Clearly, this is undesirable.

The solution is to disable input controls that are not currently on a visible PanelCard.

Assume you have a PanelNavigator (called 'PANELNAVIGATOR_1') with child PanelCards.

You could add the following expression to the client-side enable expression for each of the input controls...

enableControl('PANELCARD_1')

...where 'PANELCARD_1' was the name of the Panel Card in which the input control had been placed.

The enableControl() function would be defined as follows:

function enableControl(txt) {
    var p = {dialog.object}.panelGet('PANELNAVIGATOR_1');
    var ps = p.state;
    if( p.state.activePanel == txt) { 
        return true;
    }
    return false;
}

This function will return true if the active PanelCard name matches the passed in PanelCard name.

So, only input controls on the currently active PanelCard will be enabled and the iOS keyboard next/previous buttons will only cycle through the controls on the current PanelCard.